<!--
 * @Descripttion : 
 * @Autor        : Lilong
 * @Date         : 2022-09-30 10:54:31
 * @LastEditTime : 2022-10-01 06:02:25
 * @FilePath     : \表单控件绑定\v-model和组件\第二种(用于自定义输入组件上)\改变默认的属性名称\不和计算属性一起使用\第一种方式：v-model和defineComponent\custom-input.vue
-->
// src/components/custom-input.vue

<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
    name: 'CustomInput',
    props: ['test'],  
    emits: ['update:test'], 
    setup(props, context) {
        const handleValue  = (event) => {
            context.emit('update:test', event.target.value)
        }

        return {
            handleValue
        }
    }
})
</script>


<template>
    <input :value="test"
        @input="handleValue"
    >
</template>
